/**
 *@auther: tang
 *@Date: 2020-11-16
 *Project: group-booking-shop-manage-system
 */
import React from "react"
import options from "../../../../util/proLocation";
import ImgCrop from 'antd-img-crop';
import {
    Row,
    Col,
    Form,
    Input,
    Button,
    Select,
    Cascader,
    DatePicker,
    InputNumber,
    Switch, Checkbox,
    Radio,
    Upload
} from 'antd';
const location = options;

class InfoSetting extends React.Component {
    constructor(props) {
        super(props);
        this.state={
            pcLogofileList:[{
                uid: '-1',
                name: 'image.png',
                status: 'done',
                url: 'https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png',
            }],
            wChatLogofileList:[{
                uid: '-1',
                name: 'image.png',
                status: 'done',
                url: 'https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png',
            }],
            custype:1,
            closeshop:false,
            clShopReason:false,
            initialValues:{
                cachetime: null,
                countcode: null,
                counttop: null,
                derepository: null,
                followlink: null,
                integral: null,
                mode: null,
                pclogo: null,
                repository: null,
                review: null,
                track: null,
                wchatlogo: null,
            }
        }
    }
    onFormLayoutChange = (name,info)=> {
        // console.log(name,info)
    };
    componentWillMount() {
        this.state.closeshop?this.setState({
            clShopReason:false
        }):this.setState({
            clShopReason:true
        })
    }
    onPcLogoPreview = async file => {
        let pcsrc = file.url;
        if (!pcsrc) {
            pcsrc = await new Promise(resolve => {
                const reader = new FileReader();
                reader.readAsDataURL(file.originFileObj);
                reader.onload = () => resolve(reader.result);
            });
        }
        const image = new Image();
        image.src = pcsrc;
        const imgWindow = window.open(pcsrc);
        imgWindow.document.write(image.outerHTML);
    };
    onWchatLogoPreview = async file => {
        let src = file.url;
        if (!src) {
            src = await new Promise(resolve => {
                const reader = new FileReader();
                reader.readAsDataURL(file.originFileObj);
                reader.onload = () => resolve(reader.result);
            });
        }
        const image = new Image();
        image.src = src;
        const imgWindow = window.open(src);
        imgWindow.document.write(image.outerHTML);
    };
    onPcLogoChange(fileList){
        this.setState({
            pcLogofileList:fileList
        })
    }
    onWchatLogoChange(fileList){
        this.setState({
            wChatLogofileList:fileList
        })
    }
    formSubmitHandle(info){
        console.log(info)
    }
    wChatRemove(){
        return true
    }
    render() {
        return (
            <div>
                <Form
                    labelCol={{
                        span: 4,
                    }}
                    wrapperCol={{
                        span: 14,
                    }}
                    layout="horizontal"
                    onValuesChange={this.onFormLayoutChange.bind(this)}
                    size="default"
                    initialValues={this.state.initialValues}
                    onFinish={this.formSubmitHandle.bind(this)}
                >
                    <Form.Item label="引导关注链接" name="followlink">
                        <Input />
                    </Form.Item>
                    <Form.Item label="启用库存" name="repository">
                        <Input />
                    </Form.Item>
                    <Form.Item label="消费积分名称" name="integral">
                        <Input />
                    </Form.Item>
                    <Form.Item label="商品货号前缀" name="integral">
                        <Input />
                    </Form.Item>
                    <Form.Item label="评论审核" name="review">
                        <Radio.Group>
                            <Radio value={false}>不需要审核</Radio>
                            <Radio value={true}>需要审核</Radio>
                        </Radio.Group>
                    </Form.Item>
                    <Form.Item label="商品默认图" name="pclogo">
                        <ImgCrop rotate>
                            <Upload
                                action="https://www.mocky.io/v2/5cc8019d300000980a055e76"
                                listType="picture-card"
                                fileList={this.state.pcLogofileList}
                                onChange={this.onPcLogoChange.bind(this)}
                                onPreview={this.onPcLogoPreview.bind(this)}
                            >
                                {this.state.pcLogofileList.length < 2 && '+ Upload'}
                            </Upload>
                        </ImgCrop>
                    </Form.Item>
                    <Form.Item label="团购默认图" name="wchatlogo">
                        <ImgCrop rotate>
                            <Upload
                                action="https://www.mocky.io/v2/5cc8019d300000980a055e76"
                                listType="picture-card"
                                fileList={this.state.wChatLogofileList}
                                onChange={this.onWchatLogoChange.bind(this)}
                                onPreview={this.onWchatLogoPreview.bind(this)}
                                onRemove={this.wChatRemove.bind(this)}
                            >
                                {this.state.wChatLogofileList.length < 2 && '+ Upload'}
                            </Upload>
                        </ImgCrop>
                    </Form.Item>
                    <Form.Item label="缓存时间" name="cachetime">
                    <Input />
                    </Form.Item>
                    <Form.Item label="统计代码" name="countcode">
                        <Input />
                    </Form.Item>
                    <Form.Item label="是否启用Gzip模式" name="mode">
                        <Radio.Group>
                            <Radio value={false}>禁用</Radio>
                            <Radio value={true}>启用</Radio>
                        </Radio.Group>
                    </Form.Item>
                    <Form.Item label="统计排行" name="counttop">
                        <Radio.Group>
                            <Radio value={1}>所有</Radio>
                            <Radio value={2}>一年</Radio>
                            <Radio value={3}>半年</Radio>
                            <Radio value={4}>三个月</Radio>
                            <Radio value={5}>一个月</Radio>
                        </Radio.Group>
                    </Form.Item>
                    <Form.Item label="默认库存" name="derepository">
                        <Input/>
                    </Form.Item>
                    <Form.Item label="物流追踪" name="track">
                        <Radio.Group>
                            <Radio value={true}>需要开启</Radio>
                            <Radio value={false}>不需要开启</Radio>
                        </Radio.Group>
                    </Form.Item>
                    <Form.Item >
                        <Row>
                            <Col span={6}/>
                            <Col span={6}>
                                <Button htmlType="submit" type="primary">提交</Button>
                            </Col>
                        </Row>
                    </Form.Item>
                </Form>
            </div>
        )
    }
}

export {InfoSetting as default}

